<template>
<div>
  <div class="tops">
   
      <p style="color:white;  margin-bottom: 7px;">小u商城</p>
<div class="cen">
    <span>
        <van-icon name="location-o" size="25" color="white" />
    </span>
    <img height="20px" width="100px" style="margin-left: 10px;
  margin-right: 10px;" src="../../public/orange.png" alt="">
    <span>
       <van-search
  v-model="value"
 background="coral"
  placeholder="请内容搜索"
  @search="onSearch"
>
       </van-search>
    </span>
    <span><van-icon name="shop-o" size="24" color="white"/></span>

    

</div>
<van-tabs title-inactive-color="#ccc" title-active-color="white" line-width="20px" color="white" background="transparent">
  <van-tab v-for="index in 6" :title="'标签 ' + index" >
    
  </van-tab>
  <van-tab title="分类 ">
    
  </van-tab>
</van-tabs>
  </div>
  <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
  <van-swipe-item>图片1</van-swipe-item>
  <van-swipe-item>图片2</van-swipe-item>
  <van-swipe-item>图片3</van-swipe-item>
  <van-swipe-item>图片4</van-swipe-item>
</van-swipe>
<van-grid :column-num="5" >
  <van-grid-item v-for="value in 5" :key="value" icon="photo-o" text="文字" />
</van-grid>
<div class="cbanner">
  <div class="left">
    <img style="margin-left:8px;" src="../../public/big.png" alt="">


  </div>
  <div class="right"> 
    <img src="../../public/small.png" alt="">
    <img src="../../public/02.png" alt="">
   

  </div>
</div>
<van-tabs v-model="activeName" title-active-color="coral">
  <van-tab title="双11尖货预购" name="a"></van-tab>
  <van-tab title="厂购全球" name="b"></van-tab>
  
</van-tabs>
  </div>
</template>

<script>
export default {

}
</script>

<style>
.tops{
  /* color: rgb(233, 149, 119); */
  width: 100%;
  height: 128px;
 
  background-color: coral;
  
}
.cen{
    display:flex;
    justify-content: center;
    align-items: center;
}
.van-search{
  
    width:200px;
}
 .my-swipe .van-swipe-item {
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
    background-color: #39a9ed;
  }
  .cbanner{
    width: 100%;
    display: flex;
    margin-top: 10px;
    margin-bottom: 10px;
  }
</style>